<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>student</title>
    <div th:include="../templates/aaacommon/basic::copy"></div>
</head>

<body>
<div class="layui-form contain ">
    <form class="layui-form layui-form-pane" th:action="@{{path}/student/listPage(path=${application.basePath}) }" method="post" name="query_from" id="query_from">
        <input type="hidden" name="pageNum" id="pageNum"/>
        <input type="hidden" name="pageSize" id="pageSize"/>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">名称</label>
                <div class="layui-input-block">
                    <input type="text" name="name" class="layui-input"/>
                </div>
            </div>
            <div class="layui-inline">
                <button type="button" id="query_data" class="layui-btn layui-btn-normal">查询</button>
                <button type="reset" id="resset_from" class="layui-btn">重置</button>
            </div>
        </div>
    </form>
    <hr/>

    <button hzz:show="key_add" class="layui-btn layui-btn-sm layui-btn-primary" id="add">
        <i class="layui-icon" style="color: green;">&#xe654;</i>
        添加
    </button>

    <button hzz:show="key_delete" class="layui-btn layui-btn-sm layui-btn-primary" id="delete_all">
        <i class="layui-icon" style="color: red;">&#xe640;</i>
        &nbsp;删除
    </button>

    <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="javascript:location.reload();">
        <i class="layui-icon" style="">&#x1002;</i>
        &nbsp;刷新
    </button>

    <table id="table_list_id" lay-filter="table_list_tool" lay-data="{skin:'line,row', even:true, size:'sm'}">
    </table>
    <div id="page_div" style="display: none"></div>

</div>
</body>
<script type="text/html" id="list_tool_tpl">
    <!--
    <img class="butedit" title='查看' lay-event="detail"
         th:src="@{{path}/istyle/images/detail.png(path=${application.basePath}) }"/>
    -->
    <img hzz:show="key_update" class="butedit" title='编辑' lay-event="edit"
         th:src="@{{path}/istyle/images/edit.png(path=${application.basePath}) }"/>

    <img hzz:show="key_delete" class="butdelete" title='删除' lay-event="del"
         th:src="@{{path}/istyle/images/delete.png(path=${application.basePath}) }"/>

</script>
<script type="text/javascript">
    layui.use(['element', 'form', 'layer', 'table', 'laypage', 'web'], function () {
        var element = layui.element;
        var form = layui.form;
        var layer = layui.layer;
        var table = layui.table;
        var web = layui.web;

        var table_list_id = 'table_list_id'; // 表格id
        var table_list_tool = "table_list_tool"; //表格工具
        var contro_path = '/student'; //controller 的路径

        //查询数据
        $("#query_data").click(function () {
            web.page_query("#", "#", function (list) {
                table.render({
                    elem: '#' + table_list_id
                    , data: list
                    , cols: [
                        [
                            {type: 'checkbox'}
                            , {field: 'index', title: '序号', width: 70, templet: '<div>{{ d.LAY_INDEX }}</div>'}
                            , {field: 'name', title: '姓名'}
                            , {field: 'sex', title: '性别'}
                            , {field: 'email', title: '邮箱'}
                            , {field: 'phone', title: '手机'}
                            , {field: 'addr', title: '地址'}
                            , {field: 'createtime', title: '创建时间', width: 160 , templet: '<div>{{#  return toDateString(d.createtime);  }}</div>'}
                            , {fixed: 'right', title: '操作', width: 150, align: 'left', toolbar: '#list_tool_tpl'}
                        ]
                    ]
                });
            });
        });

        //监听工具条==>操作
        table.on('tool(' + table_list_tool + ')', function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            //查看
            if (layEvent === 'detail') {
                //do somehing
            }
            //删除
            else if (layEvent === 'del') {
                web.delete_select(contro_path, data.id, function () {
                    obj.del();
                });
            }
            //编辑
            else if (layEvent === 'edit') {
                show_edit(data.id);
            }

        });
        /**
         * '全部删除' 按钮
         */
        $("#delete_all").click(function () {
            web.delete_select_all(contro_path, table_list_id, function () {
                $("#query_data").click();
            });
        });
        /*----------------------------------------------------------
                弹出层
        ------------------------------------------------------------ */
        var ifame_height = '650px'; //弹出层的高度
        var title_name = '...';
        var font_set = 'font-size:18px;';

        //添加
        $("#add").click(function () {
            var index_add = layer.open({
                title: ['新增' + title_name, font_set]
                , type: 2
                , fixed: false
                , maxmin: true
                , area: ['600px', ifame_height]     //宽,高
                , offset: ['100px', '100px']    // top,left
                , content: web.url_replace('student/student_add')
            });
        });

        //编辑
        function show_edit(id) {
            var index_edit = layer.open({
                title: ['编辑' + title_name, font_set]
                , type: 2
                , fixed: false
                , maxmin: true
                , area: ['600px', ifame_height] //宽,高
                , offset: ['100px', '100px']// top,left
                , content: web.url_replace('student/student_edit?id=' + id)
            });
        }

    });
</script>
</html>

